<!--  -->
<template>
 <div class="sub">
   <div class="btn"><el-button type="primary" style="width:80%;opacity:0.5;margin:20px 0">新建专题+</el-button></div>
    <el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick" style="margin-top:20px"></el-tree>
     <el-divider  style="text-algin:center"></el-divider>
      <el-tree :data="ments" :props="defaultProps" @node-click="handleNodeClick" style="margin-top:10px"></el-tree>
  
 </div>
</template>

<script>
  export default {
    data() {
      return {
        data: [{
          label: '专题名称',
          children: [{
            label: '图层名称1',
          }]
        }, {
          label: '专题名称',
          children: [{
            label: '图层名称',
          },]
        },
        ],
        ments:[{
              label: 'VR全景',
          children: [{
            label: '图层名称',
          }]
        }],
        defaultProps: {
          children: 'children',
          label: 'label'
        }
      };
    },
    methods: {
      handleNodeClick(data) {
        console.log(data);
      }
    }
  };
</script>
<style lang='scss' scoped>
    .sub{
        display: flex;
        flex-direction: column;
        .btn{
            width: 100%;
            height: 41px;
            text-align: center;
           
        }
    }
</style>
